<template>
    <h1>Hello</h1>
    <h2>姓名：{{ name }}</h2>
    <h2>性别：{{ gender }}</h2>
    <h2>年龄：{{ age }}</h2>
    <button @click="changeName">修改姓名</button>
    <button @click="changeAge">修改年龄</button>
    <button @click="showTel">显示电话</button>
</template>

<script lang="ts">
    export default {
        name :"Person",
        data() {
            return {
                name:"张三",
                gender:"男",
                age:23,
                tel:13344556677
            }
        },
        methods:{
            changeName:function() {
                this.name = '李四'
            },
            changeAge() {
                this.age += 1;
            },
            showTel() {
                alert(this.tel)
            }
        }
        
    }
        
</script>

